<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="../../assets/ico/favicon.ico">

<script type="text/javascript">
	$(document)
			.ready(
					function() {
						$('.collapse')
								.on(
										'show.bs.collapse',
										function() {
											var id = $(this).attr('id');
											$('a[href="#' + id + '"]').closest(
													'.panel-heading').addClass(
													'active-faq');
											$(
													'a[href="#'
															+ id
															+ '"] .panel-title span')
													.html(
															'<i class="glyphicon glyphicon-minus"></i>');
										});
						$('.collapse')
								.on(
										'hide.bs.collapse',
										function() {
											var id = $(this).attr('id');
											$('a[href="#' + id + '"]').closest(
													'.panel-heading')
													.removeClass('active-faq');
											$(
													'a[href="#'
															+ id
															+ '"] .panel-title span')
													.html(
															'<i class="glyphicon glyphicon-plus"></i>');
										});
					});
</script>

<title>My Car Shopee</title>
<%@ include file="/templates/commonHeader.jsp"%>
</head>

<body>


	<%@ include file="/templates/commonMenu.jsp"%>

	<div id="wrap">
		<div class="container">
			<div class="row">
				<div class="col-lg-12">

					<!-- Tab panes -->
					<div class="tab-content faq-cat-content">
						<div class="tab-pane active in fade" id="faq-cat-1">
							<div class="panel-group" id="accordion-cat-1">

								<c:forEach items="${sessionScope.productLines}"
									var="productLine">


									<div class="panel panel-default panel-faq">
										<div class="panel-heading">
											<a data-toggle="collapse" data-parent="#accordion-cat-1"
												href="#faq-cat-1-sub-1">
												<h4 class="panel-title">
													${productLine.productLine} <span class="pull-right"><i
														class="glyphicon glyphicon-plus"></i></span>
												</h4>
											</a>
										</div>
										<div id="faq-cat-1-sub-1" class="panel-collapse collapse">
											<div class="panel-body">${productLine.textDescription}
											</div>
										</div>
									</div>



								</c:forEach>

							</div>
						</div>

					</div>
				</div>
			</div>
		</div>



		<%@ include file="/templates/commonFooter.jsp"%>

	</div>

	<!-- Bootstrap core JavaScript
    ================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
	<!-- Latest compiled and minified JavaScript -->
	<script
		src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
</body>
</html>
